<template>
 <div>
    <van-button
      style="position:fixed;top: 30px;right:0;z-index:999"
      type="primary"
    >loading:{{loading}}===finished:{{ finished }}===按钮</van-button>
    <van-list :finished="finished" @load="onLoad" finished-text="我是有底线的" v-model="loading">
      <van-cell :key="index" :title="item" v-for="(item,index) in list" />
    </van-list>
  </div>
</template>
<script>
export default{
    name:'',
    data () {
        return {
            list:[],
            loading : false, //加载状态 只要onLoad触发就会变成true
            finished:false,  //不能上拉  到底了
        }
    },
    created () {
    },
    computed:{
    },
    methods:{
      onLoad(){
        //初次进入也会触发 ,上拉就触发
        console.log('onLoad')
        //设置终止上拉条件
        if(this.list.length > 50){
           this.finished = true  //结束上拉, 设置值为true就表示不能上拉
           return
        }
        setTimeout(()=>{
          for(var i = 0 ; i< 20; i++ ){
             this.list.push(this.list.length+1)
          }
          this.loading = false //结束当前加载
        },1000)
      }  

  }
}
</script>
<style lang='less'  scoped>
    
</style>
